<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>新增参保家属</title>

    <!--引入本地 element-ui 的样式，-->
    <link rel="stylesheet" href="/admin/plugin/element-ui/index.css">
    <script type="text/javascript" src="/admin/js-css/js/vue.min.js"></script>
    <script type="text/javascript" src="/admin/plugin/element-ui/index.js"></script>
    <script type="text/javascript" src="/admin/plugin/element-ui/httpVueLoader.js"></script>


    <!--    引入Layui组件-->
    <link rel="stylesheet" href="/admin/plugin/layui/dist/css/layui.css" tppabs="http://res.layui.com/layui/dist/css/layui.css"  media="all">
    <script src="/admin/plugin/layui/dist/layui.js" charset="utf-8"></script>

    <script type="text/javascript" src="/admin/js-css/js/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="/admin/js-css/js/mx1.0.js?v=1.1.1"></script>
    <script type="text/javascript" src="/admin/html/module/yumenyoutian/js/api.js"></script>


    <style>
        .top_btn_box {
            display: flex;
            justify-content: space-between;
            margin-bottom: 10px;
        }
        .concent {
            display: flex;
            justify-content: space-between;
        .input_box {
            height: 500px;
            overflow: auto;
        }
        }

        body{
            padding: 10px;
        }
    </style>
</head>
<body>

    <div id="app">
        <div class="app-container">
            <!-- 新增参保家属页面 -->
            <!-- 顶部按钮部分 -->
            <div class="top_btn_box">
                <div>
                    <el-button size="small" type="primary" @click="openChoosePerson"
                    >新增</el-button
                    >
                    <el-button
                            size="small"
                            type="success"
                            v-show="hasData"
                            @click="savePerson"
                    >保存</el-button
                    >
                </div>
                <div v-show="hasData">
                    <el-button size="small" type="danger" @click="deleteRow"
                    >删除</el-button
                    >
                    <el-button
                            size="small"
                            type="primary"
                            style="margin-right: 10px"
                            @click="submitForReview"
                    >提交审核</el-button
                    >
                    <helpBtn :helpId="3006" />
                </div>
            </div>

            <!-- flex布局 -->
            <div class="concent" v-show="hasData">
                <div class="input_box">
                    <!-- 公共录入组件 -->
                    <indexinput
                            ref="inputCommon"
                            module="addFamily"
                            :tableid="tableId"
                            v-loading="loading"
                    ></indexinput>
                </div>
                <div style="width: 480px">
                    <personlist
                            ref="personList"
                            :tableid="tableId"
                            :choosePerson="changeWorker"
                    />
                </div>
            </div>

            <!-- 选择个人信息弹窗 -->
            <ChoosePerson
                    :visible="choosePerson.visible"
                    :type="'4'"
                    :typeId="'1'"
                    :tableId="tableId"
                    :remoteClose="remoteClose"
            />
        </div>
    </div>

    <script>


        var vm = new Vue({
           el:"#app",
            components: {
                "indexinput" : httpVueLoader("/admin/html/module/yumenyoutian/personnelInfo/addFamily/jiashu_new_input.vue"),
                "personlist" : httpVueLoader("/admin/html/module/yumenyoutian/personnelInfo/workerReduce/personList.vue"),
            },
            data() {
                return {
                    // 选择人员
                    choosePerson: {
                        visible: false,
                    },
                    // 当前编辑的表单ID
                    tableId: "43",
                    hasData: false,
                    loading: false,
                    newFormData: {},
                    typeId:"1"
                };
            },
            created() {
                this.getData();
            },
            methods: {
                // 抓取数据判断是否有未提交数据
                async getData() {
                    const params = {
                        tableId: this.tableId,
                    };
                    const res = await api.queryBody(
                        "/admin/api/bfmc/BasicInformationModificationController/rightDataList",
                        params
                    );
                    if (res.code == 1) {
                        console.log(res.data);
                        if (res.data.length == 0) {
                            console.log("没有数据");
                            this.$refs.inputCommon.formData = {};
                            this.$refs.personList.tableData = [];
                            this.hasData = false;
                        } else {
                            console.log("有数据");
                            this.hasData = true;
                            this.$refs.personList.tableData = res.data;
                            this.$refs.inputCommon.formData = res.data[0];
                            this.$refs.personList.highlight(res.data[0]);
                        }
                    } else {
                        this.$message.error(res.msg);
                    }
                },
                // 选择新的人员
                async getInputAndList(data) {
                    this.hasData = true;
                    this.choosePerson.visible = false;
                    for (let key in data) {
                        if (key != "obj") {
                            this.newFormData[key] = data[key];
                        }
                    }
                    this.newFormData.aae144 = data.obj.aae144;
                    this.newFormData.aac004 = data.obj.aac004;
                    // this.newFormData.aac005 = data.obj.aac005;
                    this.newFormData.aac006 = data.obj.aac006;
                    this.newFormData.aae160 = "800";
                    this.newFormData.aae032 = data.obj.aae032;
                    this.newFormData.aae145 = data.obj.aae145;
                    this.newFormData.aae005 = data.obj.aae005;
                    // this.newFormData.aae008 = data.obj.aae008;
                    // this.newFormData.aae010 = data.obj.aae010;
                    this.newFormData.aae006 = data.obj.aae006;
                    this.newFormData.aac010 = data.obj.aac010;
                    // this.newFormData.byv001 = data.obj.byv001;
                    this.newFormData.aab001 = data.obj.aab001;
                    this.newFormData.aac001 = data.obj.aac001;
                    this.newFormData.pcc001 = data.obj.pcc001;
                    this.newFormData.zgsfhm = data.obj.aac002;
                    this.newFormData.zgxm = data.obj.aac003;
                    this.newFormData.nka002 = "6";
                    this.$refs.inputCommon.formData = this.newFormData;
                },
                async chooseSubmit(data) {
                    if (JSON.stringify(data) == "{}") {
                        this.$message.error("请先选中一条数据");
                        return;
                    } else {
                        let bhid = data[0].aac001;
                        if(this.typeId == '1'){
                            bhid = data[0].aac001;
                        }else if(this.typeId == '2'){
                            bhid = data[0].pcc001;
                        }else{
                            bhid = data[0].aab001;
                        }
                        const params = {
                            dataid: bhid,
                            tableId: this.tableId,
                            type: this.typeId
                        };
                        const res = await api.queryBody(
                            "/admin/api/bfmc/BasicInformationModificationController/selectForObject",
                            params
                        );
                        if (res.code == 1) {
                            console.log(res);
                            this.loading = true;
                            this.getInputAndList(res.data);
                            setTimeout(()=>{
                                this.loading = false;
                            },500)
                        } else {
                            this.$message.error(res.msg);
                        }
                    }
                },
                // 打开人员选择窗口
                openChoosePerson() {
                    let _this = this;
                    let btn = {
                        btn: ['确定', '取消']
                        , yes: async function (index, layero) {
                            //按钮【按钮一】的回调
                            let win = getTopIframe(layero);
                            let data = win.vm.selectData;
                            if(data.length>1){
                                top.alert("只能选择一条记录进行操作！");
                                return;
                            }
                            if(data.length == 0){
                                top.alert("请选择一条记录进行操作！");
                                return;
                            }
                            _this.chooseSubmit(data);
                            top.layer.closeAll();
                        }
                        , btn2: function (index, layero) {
                            //按钮【按钮二】的回调
                            //return false 开启该代码可禁止点击该按钮关闭
                        }
                    };

                    top.f_layer_open_get("/admin/html/dataManagement/list.html?tableId="+getTableId("9"), "90%", "85%", function () {

                    }, btn, "选择职工个人基本信息");
                },
                // 关闭选择窗口
                remoteClose() {
                    this.choosePerson.visible = false;
                },
                // 保存数据
                async savePerson() {
                    this.$refs.inputCommon.$refs.form.validate(async (valid) => {
                        if (valid) {
                            console.log("验证通过");
                            const params = {
                                tableId: this.tableId,
                                mapdata: this.$refs.inputCommon.formData,
                            };
                            const res = await api.postBody(
                                "/admin/api/bfmc/BasicInformationModificationController/dataChangeEntrySaveLess",
                                params
                            );
                            if (res.code == 1) {
                                this.$message.success(res.msg);
                                this.$refs.personList.loading = true;
                                // 更新右侧数据
                                this.$refs.personList.tableData = res.data;
                                this.$refs.personList.selectAll();
                                setTimeout(() => {
                                    this.$refs.personList.loading = false;
                                }, 500);
                            } else {
                                this.$message.error(res.msg);
                            }
                        } else {
                            console.log("验证失败");
                            return false;
                        }
                    });
                },
                // 点击右侧数据渲染左侧表单
                changeWorker(row) {
                    console.log(row);
                    this.loading = true;
                    this.$refs.inputCommon.formData = row;
                    setTimeout(() => {
                        this.loading = false;
                    }, 500);
                },
                // 删除右侧选中行
                deleteRow() {
                    this.$refs.personList.deleteRows();
                },
                // 提交审核
                async submitForReview() {
                    this.$refs.personList.submitRow("newlyAddedInsuredFamilyMembers");
                },
            },
        });
    </script>
</body>
</html>